<script setup lang="ts">
import {Tabbar, TabbarItem} from 'vant';
import { ref,watch } from 'vue';
import {RouterView,useRouter,useRoute} from "vue-router";



const router = useRouter()
const route = useRoute()

const active = ref(route.name as string)

watch(active, (nv) => {
  router.push({
    name: nv
  })
})


</script>

<template>


  <RouterView />
    <Tabbar v-model="active">
       <TabbarItem name="home" icon="home-o">首页</TabbarItem>
        <TabbarItem name="order" icon="bars">订单</TabbarItem>
        <TabbarItem name="mine" icon="user-o">我的</TabbarItem>
    </Tabbar>


</template>

<style>
.center {
    text-align: center;
}
</style>
